html, body {
  height: 100%;
}
body{
    width: 10rem;
    margin: 0 auto;
}
#app {
  height: 100%;
}
*{
  box-sizing: border-box;
  list-style: none;
}

@function px2rem($px, $base-font-size: 72px) {
  @if (unitless($px)) {
    //@warn "Assuming #{$px} to be in pixels, attempting to convert it into pixels for you";
    @return px2rem($px + 0px); // That may fail.
  } @else if (unit($px) == rem) {
    @return $px;
  }
  @return ($px / $base-font-size) * 1rem;
}

@mixin font-dpr($font-size) {
  font-size: $font-size;
  [data-dpr="2"] & {
    font-size: $font-size * 2;
  }
  [data-dpr="3"] & {
    font-size: $font-size * 3;
  }
}
